<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv= "X-UA-Compatible" content = "IE=edge,chrome=1" />
    <link rel="shortcut icon" type="image/x-icon" href="http://img.boyitongcheng.com/favicon.ico" media="screen"/>
    <title>博艺网-案例详情</title>
    <link href="/common/css/common.css" rel="stylesheet"/>
    <link href="/common/css/page.css" rel="stylesheet"/>
    <link href="/common/css/caseDetail.css" rel="stylesheet"/>
    <link href="/common/css/iconfont.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="/common/js/jquery-1.9.0.min.js"></script>

</head>
<body>

<#include "header.ftl"/>

<#include "banner_other.ftl"/>

<div class="sub_nav">
    <div class="main">
        <ul class="sub_navtop">

            <li><a href="/index">首页</a></li>
        <#if topList??>

            <#list topList as top>
                <li><a href="/list?channel_id=${top.getId()}&position_id=${top.getPositionId()}&style_type=0&price=0&area=0" target="_blank">${top.getName()}</a></li>
            </#list>

        </#if>

        </ul>
    </div>
</div>

<!--顶部案例详情 开始-->
<div class="caseDetail">
    <div class="main">
        <p class="topmes"><span>案例详情</span></p>
        <div class="picture">
            <div class="maxImg" id="maxImg">
                <#if exampleDetails??>
                    <#list exampleDetails as detailBvo>
                        <img src="http://img.boyitongcheng.com/${detailBvo.getImgUrl()}!640x360" class="img-responsive" width="640px;" height="360px;"/>
                    </#list>
                </#if>
            </div>
            <ul class="minImg" id="minImg">
                <#if exampleDetails??>
                    <#list exampleDetails as detailBvo>
                        <li <#if detailBvo_has_next><#else >class="last"</#if> ><img src="http://img.boyitongcheng.com/${detailBvo.getImgUrl()}!88x50" class="img-responsive" width="88px;" height="50px;"/></li>
                    </#list>
                </#if>
            </ul>
        </div>
        <div class="casemes">
            <h2 class="casename">${example.name}</h2>
            <img src="<#if userInfoBvo?? && userInfoBvo.getAvatar()??>http://img.boyitongcheng.com/${userInfoBvo.getAvatar()}<#else>/common/images/default_avatar.png</#if>" class="avatar"/>
            <p >${userInfoBvo.bizWork.name}：<span>${userInfoBvo.cnName!''}</span></p>
            <p class="time">婚礼时间：<span>${example.caseTime}</span></p>
            <p class="address">婚礼地点：<span>${example.caseHotel}</span></p>
            <p >${example.descn!''}</p>

            <p><a href="/biz_index?user_id=${userInfoBvo.getId()?string}"><span style="padding:5px 10px;background-color: #ea4c89;color: #FFF">联系TA</span></a></p>
        </div>
    </div>
</div>
<!--顶部案例详情  结束-->

<#if recommendUsers??>
    <div class="recommend">
        <div class="main">
            <h2>推荐团队</h2>

            <div class="team_member" style="padding:0px;border:0px;overflow: auto;">
                <ul>
                    <#list recommendUsers as userBvo>
                        <li>
                            <div class="recommend_avatar">
                                <a href="/biz_index?user_id=${userBvo.recommendUser.getId()?string}"><img src="http://img.boyitongcheng.com/${userBvo.recommendUser.getAvatar()}" class="img-responsive" width="64px;" height="64px;"/></a>
                            </div>
                            <div class="info">
                                <p class="name">${userBvo.recommendUser.bizWork.name}：${userBvo.recommendUser.cnName}</p>
                                <p class="price"><#if userBvo.recommendUser.bizPrice??>¥${userBvo.recommendUser.bizPrice?string("0.00")}元<#else>&nbsp;</#if></p>
                                <p class="detail"><#if userBvo.recommendUser.getBizStar()??>${userBvo.recommendUser.getBizStar()}<#else>0%</#if> 好评率  |  <#if userBvo.recommendUser.getBizDealCount()??>${userBvo.recommendUser.getBizDealCount()}<#else>0</#if> 预订量</p>
                            </div>
                        </li>

                    </#list>

                </ul>
            </div>
        </div>
    </div>
</#if>

<!--费用 开始-->
<div class="review">
    <div class="main">
        <h2>费用明细</h2>
        <div class="review_detail">

        ${example.caseDetail!''}

        </div>
    </div>
</div>

<!--评价 开始-->
<div class="review">
    <div class="main">
        <h2>评论详情</h2>
        <div class="review_detail">
            <div class="totalScore">所有评价</div>

            ${example.caseComment!''}

        </div>
    </div>
</div>


<#include "footer.ftl">

<#include "toolbar.ftl">

<script>
    var maxImg=$('#maxImg img');
    var minImg=$('#minImg li');

    $(minImg).each(function(index){
        $(this).hover(function(){
            $(this).css({'border':'2px solid #ff6537'}).siblings().css({'border':'2px solid transparent'});
            $(maxImg[index]).show().siblings().hide();
        },function(){
            $(minImg).css({'border':'2px solid transparent'});
        });

    });

</script>
</body>
</html>